<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!doctype html>
<html class="no-js">
<head>
    <%@ include file="./../common/meta.jsp" %>
    <link rel="stylesheet" href="../../css/store.css">
</head>
<body>
<header data-am-sticky class="am-header am-header-default am-no-layout">
    <div class="am-header-left am-header-nav">
        <a href="./store-list.jsp" class="" id="last">
            <i class="am-header-icon am-icon-chevron-left"></i>
        </a>
    </div>
    <h1 class="am-header-title">好店</h1>
</header>

<div class="am-content">

    <figure data-am-widget="figure" class="am am-figure am-figure-default" data-am-figure=""
            id="haodian-detail-headimage">
    </figure>


    <div class="det-title">环境展示</div>
    <ul data-am-widget="gallery" class="am-gallery am-avg-sm-3 am-avg-md-3 am-avg-lg-4 am-gallery-default"
        data-am-gallery="" id="huanjing">
    </ul>


    <div class="det-title">产品介绍</div>
    <ul data-am-widget="gallery" class="am-gallery am-avg-sm-3 am-avg-md-3 am-avg-lg-4 am-gallery-default"
        data-am-gallery="" id="chanping">
    </ul>


    <div class="det-title">设计师风采(挑选御用设计师)</div>
    <ul data-am-widget="gallery" class="am-gallery am-avg-sm-3
  am-avg-md-3 am-avg-lg-4 am-gallery-imgbordered" data-am-gallery="{  }" id="shopDesigner">

    </ul>


    <div class="det-title">服务价格</div>

    <div class="am-list-news-bd">
        <ul class="am-list" id="service-list">
        </ul>
        <%--<button type="button" class="am-btn am-btn-primary am-btn-block">确定</button>--%>
    </div>


    <div class="det-title">用户评价</div>
    <div class="am-container">
        <div data-am-widget="list_news" class="am-list-news am-list-news-default">
            <div class="am-list-news-bd">
                <ul class="am-list" id="haodian-comment-list">

                </ul>
            </div>

        </div>
    </div>


    <div class="det-title">消费说明:</div>
    <div id="consumerDetail">
    </div>

    <input type="button" id="pay" value="购买"
           class="am-btn-block am-btn am-btn-primary am-btn-sm">


</div>


<%@ include file="./../common/footerNav.jsp" %>
<%@ include file="./../common/footer.jsp" %>


<script id="haodian-comment-template" type="text/x-handlebars-template">


    {{#each comments}}
    <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left">
        <div class=" am-u-sm-8 am-list-main">
            <div class="am-list-item-text">
                {{account}} {{createdate}}
            </div>

            <div class="am-list-item-text">
                {{content}}
            </div>
        </div>
    </li>
    {{/each}}

</script>


<script id="haodian-detail-headimage-template" type="text/x-handlebars-template">


    <img src="{{imageBase}}{{shopheadimage}}" height="200px"/>
    <figcaption class="am-figure-capition-btm">
        {{shopname}}
    </figcaption>

</script>


<script id="haodian-detail-huanjing-template" type="text/x-handlebars-template">

    {{#each enviroments}}
    <li>
        <div class="am-gallery-item">
            <a href="#" class="">
                <img src="{{../imageBase}}{{this}}"/>

            </a>
        </div>
    </li>
    {{/each}}

</script>


<script id="haodian-detail-chanping-template" type="text/x-handlebars-template">


    {{#each products}}
    <li>
        <div class="am-gallery-item">
            <a href="#" class="">
                <img src="{{../imageBase}}{{this}}"/>

            </a>
        </div>
    </li>
    {{/each}}

</script>


<script id="haodian-consumer-detail-template" type="text/x-handlebars-template">

    <article data-am-widget="paragraph"
             class="am-paragraph am-paragraph-default"
             data-am-paragraph="{tableScrollable: true}">
        {{consumerdetail}}

    </article>

</script>


<script id="service-template" type="text/x-handlebars-template">

    {{#each providers}}
    <li class="am-g">
        <label class="am-radio-inline">
            <input type="radio" name="shopService" class="service" value="{{id}}">原价:{{serviceprice}}&nbsp;&nbsp;{{servicename}}&nbsp;&nbsp;现价:{{servicenowprice}}
        </label>
    </li>
    {{/each}}

</script>


<script id="designer-template" type="text/x-handlebars-template">

    {{#each designers}}

    <li>
        <div class="am-gallery-item">
            <a href="./store-designer-detail.jsp?designerId={{id}}&&id={{../id}}&&catId={{../catlogid}}" class="">
                <img src="{{../imageBase}}{{designerimage}}"/>

            </a>
        </div>
    </li>
    {{/each}}

</script>

<script>

    $(function () {
        var id = "<%=request.getParameter("id")%>";
        var catlogid = "<%=request.getParameter("catId")%>";
        var href = $("#last").attr("href");
        $("#last").attr("href", href + "?catId=" + catlogid);


        var url = "/h5GoodShop/getShopDetail?id=" + id;
        $.post(url, function (result) {

            var source = $('#haodian-detail-headimage-template').html();
            var template = Handlebars.compile(source);
            var html = template(result);
            $("#haodian-detail-headimage").append(html);


            var source = $('#haodian-detail-huanjing-template').html();
            var template = Handlebars.compile(source);
            var html = template(result);
            $("#huanjing").append(html);


            var source = $('#haodian-detail-chanping-template').html();
            var template = Handlebars.compile(source);
            var html = template(result);
            $("#chanping").append(html);


            var source = $('#haodian-consumer-detail-template').html();
            var template = Handlebars.compile(source);
            var html = template(result);
            $("#consumerDetail").append(html);


            var source = $('#service-template').html();
            var template = Handlebars.compile(source);
            var html = template(result);
            $("#service-list").append(html);


            var source = $('#designer-template').html();
            var template = Handlebars.compile(source);
            var html = template(result);
            $("#shopDesigner").append(html);


            var source = $('#haodian-comment-template').html();
            var template = Handlebars.compile(source);
            var html = template(result);
            $("#haodian-comment-list").append(html);


        });

        $("#pay").click(function () {
            var serviceId = $("input[name=shopService]:checked").val();
            if (serviceId == null || serviceId == "" && typeof serviceId == "undefined") {
                alert("请选择服务");
                return false;
            }
            window.location.href = "./store-service-detail.jsp?catId=" + catlogid + "&id=" + id + "&serviceId=" + serviceId;
        })


    })


</script>


</body>


</html>